<template>
	<s-container>
		<template #searchForm>
			<n-button type="primary" @click="handleQuery">搜索</n-button>
			<n-button type="success" @click="()=>showSqlGenModal=true">导入表格</n-button>
		</template>
		<template #dataTable>
			<loading-empty-wrapper class="flex-col flex-1" :loading="loading" :empty="empty">
				<s-data-table :list="list" v-model:pageObj="pageObj" :columns="columns" />
			</loading-empty-wrapper>
		</template>
	</s-container>
	<n-modal v-model:show="showSqlGenModal" title="根据建表语句导入表对象" display-directive="if" :bordered="false" preset="card" class="w-auto" size="huge" :closable="false" >
		<sql-gen  @close="()=>showSqlGenModal=false" @list="getList"/>
	</n-modal>
	<n-modal v-model:show="showPreviewCodeModal" title="代码预览" display-directive="if" :bordered="false" preset="card" class="w-auto" size="huge" :closable="true" >
		<code-preview :id="activeId!" />
	</n-modal>
</template>

<script  setup lang='tsx' >
import { featchGenTablePage,fetchDoGenCode,fetchDelGenCode } from "@/service/api/genCode/index"
import { onMounted, ref, Ref } from "vue";
import { GenTable } from "./index"
import { usePageList } from '@/hooks';
import { DataTableColumns,useDialog } from "naive-ui";
import sqlGen from './module/selGen.vue'
import codePreview from './module/codePreview.vue'
import { useRouterPush } from '@/composables';
import { saveAs } from 'file-saver';

const { routerPush } = useRouterPush()
 const dialog = useDialog()
type DataSource = GenTable
const columns: Ref<DataTableColumns<DataSource>> = ref([
	{
		title: '表名',
		key: 'name',
		align: 'center',
	},
	{
		title: '作者',
		key: 'author',
		align: 'center',
	},
	{
		title: '包前缀',
		key: 'prePackage',
		align: 'center',
	},
	{
		title: '模块名',
		key: 'moduleName',
		align: 'center',
	},
	{
		title: '业务名',
		key: 'className',
		align: 'center',
	},
	{
		title: '数据库类型',
		key: 'dbType',
		align: 'center',
	},
	{
		title: '备注',
		key: 'comment',
		align: 'center',
	},
	{
		title: '创建时间',
		key: 'createTime',
		align: 'center',
	},
	{
		title: '操作列',
		key: '',
		align: 'center',
		render:(rowData:DataSource, rowIndex)=>{
			const id = rowData.id!
			return <>
				<n-space justify="center">
					<n-button strong secondary type="primary" onClick={()=>handleUpdate(id)}>修改</n-button>
					<n-button strong secondary type="error" onClick={()=>handleDel(id)}>删除</n-button>
					<n-button strong secondary type="warning" onClick={()=>handleGenCode(id)}>生成</n-button>
					<n-button strong secondary type="success" onClick={()=>handelPreview(id)}>预览</n-button>
				</n-space>
			</>
		}
	},
]) as Ref<DataTableColumns<DataSource>>;


const {
	loading,
	empty,
	searchForm,
	list,
	pageObj,
	getList,
	handleQueryReset,
	handleQuery
} = usePageList<DataSource>(
	null,
	featchGenTablePage,
	undefined,
	undefined
);
const showSqlGenModal = ref<boolean>(false)
const showPreviewCodeModal = ref<boolean>(false)
const activeId = ref<Common.IdType|null>()
function handleUpdate(id:Common.IdType){
	routerPush({name:"genCodeEdit",query:{id}},false)
}

async function handleGenCode(id:Common.IdType){
	const {data} = await fetchDoGenCode(id)
	const blob = new Blob([data],{type:'application/octet-stream;'})
	saveAs(blob,"oneThingCodeGen.zip")
	window.$message?.success("申请导出成功，请等候浏览器下载～")

}

function handelPreview(id:Common.IdType){
	activeId.value = id
	showPreviewCodeModal.value = true
}
function handleDel(id:Common.IdType){
	//
  dialog.warning({
		title: '警告',
		content: '你确定删除当前记录吗？',
		positiveText: '确定',
		negativeText: '不确定',
		onPositiveClick: async () => {
			const {error} = await fetchDelGenCode([id])
			if(!error){
				window.$message?.success("操作成功")
				getList()
			}

		},
		onNegativeClick: () => {

		}
	})
}
onMounted(() => {
	getList()
})
</script>

<style lang='scss' scoped></style>
